<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <body>
        <ui:composition template="./AdminTemplate.xhtml">
            <ui:define name="content">
                <div class="grid_2">
                    <div class="da-panel">
                        <div class="da-panel-header">
                            <span class="da-panel-title">
                                <img src="images/icons/color/accept.png" alt=""/>
                                Validation Example 1
                            </span>
                        </div>
                        <div class="da-panel-content">
                            <form novalidate="novalidate" id="da-ex-validate1" class="da-form">
                                <div id="da-ex-val1-error" class="da-message error" style="display:none;"></div>
                                <div class="da-form-inline">
                                    <div class="da-form-row">
                                        <label>Required<span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="req1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Email<span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="email1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>URL<span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="url1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Password <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input id="pass1" name="pass1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Confirm Password <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="cpass1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Round Number<span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="digits1" type="text"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="da-button-row">
                                    <input value="Validate Me" class="da-button red" type="submit"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="grid_2">
                    <div class="da-panel">
                        <div class="da-panel-header">
                            <span class="da-panel-title">
                                <img src="images/icons/color/accept.png" alt=""/>
                                Validation Example 2
                            </span>
                        </div>
                        <div class="da-panel-content">
                            <form novalidate="novalidate" id="da-ex-validate2" class="da-form">
                                <div id="da-ex-val2-error" class="da-message error" style="display:none;"></div>
                                <div class="da-form-inline">
                                    <div class="da-form-row">
                                        <label>Field [min length 5] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="minl1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Field [max length 5] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="maxl1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Field [length 5-10] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="rangel1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Number [min 5] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="min1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Number [max 5] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="max1" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Number [5-10] <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="range1" type="text"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="da-button-row">
                                    <input value="Validate Me" class="da-button blue" type="submit"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="clear"></div>

                <div class="grid_2">
                    <div class="da-panel">
                        <div class="da-panel-header">
                            <span class="da-panel-title">
                                <img src="images/icons/color/accept.png" alt=""/>
                                Validation Example 3
                            </span>
                        </div>
                        <div class="da-panel-content">
                            <form novalidate="novalidate" id="da-ex-validate3" class="da-form">
                                <div class="da-form-inline">
                                    <div class="da-form-row">
                                        <label>Radio Button <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <ul class="da-form-list">
                                                <li><input name="gender" type="radio"/> <label>Male</label></li>
                                                <li><input name="gender" type="radio"/> <label>Female</label></li>
                                            </ul>
                                            <label for="gender" class="error" generated="true" style="display:none;"></label>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Checkbox <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <ul class="da-form-list">
                                                <li><input name="sport" type="checkbox"/> <label>Soccer</label></li>
                                                <li><input name="sport" type="checkbox"/> <label>Badminton</label></li>
                                                <li><input name="sport" type="checkbox"/> <label>Tennis</label></li>
                                            </ul>
                                            <label for="sport" class="error" generated="true" style="display:none;"></label>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>File <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <div class="customfile"><span class="customfile-button" aria-hidden="true">Browse</span><span class="customfile-feedback" aria-hidden="true">No file selected...</span>
                                                <input name="file1" class="da-custom-file customfile-input" type="file"/></div>
                                            <label for="file1" class="error" generated="true" style="display:none;"></label>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Dropdown <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <select name="dd1">
                                                <option></option>
                                                <option value="1">Option 1</option>
                                                <option value="2">Option 2</option>
                                                <option value="3">Option 3</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Dropdown with Chosen <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <select class="chzn-done" style="display: none;" id="da-ex-val-chzn" name="chosen1">
                                                <option></option>
                                                <option value="1">Option 1</option>
                                                <option value="2">Option 2</option>
                                                <option value="3">Option 3</option>
                                            </select><div style="width: 302px;" class="chzn-container chzn-container-single" id="da_ex_val_chzn_chzn"><a href="javascript:void(0)" class="chzn-single chzn-default"><span>Select an Option</span><div><b></b></div></a><div class="chzn-drop" style="left: -9000px; width: 300px; top: 25px;"><div class="chzn-search"><input style="width: 278px;" autocomplete="off" type="text"/></div><ul class="chzn-results"><li id="da_ex_val_chzn_chzn_o_1" class="active-result" style="">Option 1</li><li id="da_ex_val_chzn_chzn_o_2" class="active-result" style="">Option 2</li><li id="da_ex_val_chzn_chzn_o_3" class="active-result" style="">Option 3</li></ul></div></div>
                                            <label for="da-ex-val-chzn" generated="true" class="error" style="display:none;"></label>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Spinner</label>
                                        <div class="da-form-item large">
                                            <input id="da-ex-val-spin" name="spin1" value="3" type="text"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="da-button-row">
                                    <input value="Validate Me" class="da-button green" type="submit"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="grid_2">
                    <div class="da-panel">
                        <div class="da-panel-header">
                            <span class="da-panel-title">
                                <img src="images/icons/color/text_signature.png" alt=""/>
                                Simple Registration Form
                            </span>
                        </div>
                        <div class="da-panel-content">
                            <form novalidate="novalidate" id="da-ex-validate4" class="da-form" style="padding-top:23px;">
                                <fieldset class="da-form-inline">
                                    <legend>Account Info</legend>
                                    <div class="da-form-row">
                                        <label>Email <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="email" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Password</label>
                                        <div class="da-form-item large">
                                            <input id="pass2" name="pass2" type="text"/>
                                        </div>
                                    </div>
                                    <div class="da-form-row">
                                        <label>Confirm Password <span class="required">*</span></label>
                                        <div class="da-form-item large">
                                            <input name="cpass2" type="text"/>
                                        </div>
                                    </div>
                                </fieldset>
                                <fieldset class="da-form-inline">
                                    <legend>Delivery Options</legend>
                                    <div class="da-form-row">
                                        <label>Souvenir Delivery Address</label>
                                        <div class="da-form-item large">
                                            <textarea name="address"></textarea>
                                            <ul class="da-form-list inline clearfix">
                                                <li><input id="souvenirs" name="souvenirs" type="checkbox"/>
                                                    <label>Yes, send me the souvenirs</label></li>
                                            </ul>
                                        </div>
                                    </div>
                                </fieldset>
                                <div class="da-button-row">
                                    <input value="Reset" class="da-button gray left" type="reset"/>
                                    <input value="Register" class="da-button pink" type="submit"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>


            </ui:define>

        </ui:composition>

    </body>
</html>
